<script setup>
	import {
		ref,
		onMounted
	} from "vue";
	import {
		onShow
	} from '@dcloudio/uni-app';
	const platform = ref({

	});
	onMounted(() => {
		platform.value = uni.getStorageSync("platform")
		console.log(platform.value);
	});
	const list = [{
			title: '清空缓存',
			url: ''
		}, {
			title: '用户协议',
			url: ''
		}, {
			title: '发音类型',
			url: ''
		}, {
			title: "Wi-Fi设置",
			action: "android.settings.WIFI_SETTINGS",
		},
		{
			title: "蓝牙设置",
			action: "android.settings.BLUETOOTH_SETTINGS",
		},
		{
			title: "日期时间",
			action: "android.settings.DATE_SETTINGS",
		}, {
			title: '系统版本',
			url: ''
		}, {
			title: '设备编码',
			url: ''
		},
		{
			title: "屏幕亮度",
			action: "android.settings.DISPLAY_SETTINGS",
		},
		{
			title: "系统管理",
			action: "android.settings.SETTINGS",
		},
	];

	// 返回上一页
	const goback = () => {
		uni.navigateBack();
	};

	// 跳转到对应系统设置
	const showInfo = (index, action) => {
		if (index == 6 || index == 7 || index == 2) return
		if (index == 0) {
			let userValueInfo = uni.getStorageSync("USER_TOKEN_INFOS")
			uni.clearStorage({
				success() {
					uni.showToast({
						title: '缓存已清除',
						icon: 'none'
					});
					huancun.value = 0
					uni.setStorageSync('bofangmoshi', type.value)
					uni.setStorageSync("USER_TOKEN_INFOS", userValueInfo);
					uni.setStorageSync('platform', platform.value);
				}
			})
			return
		}
		if (index == 1) {
			uni.navigateTo({
				url: "/pages/yonghu/index?type=" + 1,
			});
			return
		}
		if (!action) {
			uni.showToast({
				title: "功能未实现",
				icon: "none",
			});
			return;
		}
		const systemInfo = uni.getSystemInfoSync();
		if (systemInfo.platform === "android") {
			plus.runtime.launchApplication({
					action,
				},
				(e) => {
					uni.showToast({
						title: "跳转失败：" + e.message,
						icon: "none",
					});
				}
			);
		} else {
			uni.showToast({
				title: "仅支持 Android 跳转",
				icon: "none",
			});
		}
	};
	const huancun = ref(0);
	onShow(() => {
		uni.getStorageInfo({
			success: function(res) {
				huancun.value = res.currentSize;
			},
			fail: function() {
				console.log('获取缓存信息失败');
			}
		});
	});
	const info = ref({})
	uni.getSystemInfo({
		success(e) {
			console.log(e);
			info.value.imei = e.deviceId
			info.value.bianma = e.appVersion
		}
	})
	const type = ref(2)
	if (uni.getStorageSync('bofangmoshi')) {
		type.value = uni.getStorageSync('bofangmoshi')
	}
	const changeSelectList = (index) => {
		type.value = index + 1
		uni.setStorageSync('bofangmoshi', type.value)
		console.log(type.value);
	}
</script>

<template>
	<view class="wrap">
		<view class="header-wrap uni-row" :style="{
        paddingTop: platform.dingbu + 'rpx',
        height: platform.dingbu + 96 + 'rpx',
      }">
			<image class="left" src="/static/img/goback-black.png" @click="goback" mode="widthFix" />
			<view class="title">系统设置</view>
			<image style="opacity: 0;" class="left" src="/static/img/goback-black.png" mode="widthFix" />
		</view>

		<template v-for="(item, index) in list" :key="index">
			<view @click="showInfo(index, item.action)" class="item uni-row">
				<view class="titles">{{ item.title }}</view>
				<view style="flex: 1;text-align: right;font-size: 28rpx;" v-if="index == 0">
					{{ huancun }}KB
				</view>
				<view style="flex: 1;text-align: right;font-size: 28rpx;" v-if="index == 6">
					{{ info.bianma }}
				</view>
				<view class="uni-row ssss" style="flex: 1; text-align: right; font-size: 28rpx;" v-if="index == 2">
					<view class="items uni-row" v-for="(i, iIndex) in ['美式', '英式']" :key="iIndex"
						@click.stop="changeSelectList(iIndex)">
						<image v-if="(iIndex == 0 && type == 1) || (iIndex == 1 && type == 2)"
							src="/static/img/shezhi/select.png" class="ss icon"></image>
						<image v-else src="/static/img/shezhi/bai.png" class="s icon"></image>
						{{i}}
					</view>
				</view>
				<view style="flex: 1;text-align: right;font-size: 28rpx;" v-if="index == 7">
					{{ info.imei }}
				</view>
				<image v-if="index!=0&&index!=6&&index!=7&&index!=2" src="/static/img/shezhi/right.png"
					class="rights" />
			</view>
		</template>
	</view>
</template>

<style scoped lang="less">
	.wrap {
		.header-wrap {
			justify-content: space-between;
			padding-left: 24rpx;
			padding-right: 24rpx;

			.left {
				width: 48rpx;
			}

			.title {
				font-weight: 500;
				font-size: 32rpx;
				color: #333333;
				margin-left: 32rpx;
			}
		}

		.item {
			justify-content: space-between;
			padding: 20rpx 24rpx;
			height: 96rpx;

			.titles {
				font-size: 28rpx;
				color: #333;
			}

			.rights {
				width: 32rpx;
				height: 32rpx;
			}
		}

		.ssss {
			justify-content: flex-end;
		}

		.items {
			justify-content: center;
			margin-left: 20rpx;
			// width: 96rpx;
			height: 48rpx;
			// background: #F7F7F7;
			// border-radius: 8rpx;
			font-size: 24rpx;
			color: #999999;

			.icon {
				width: 32rpx;
				height: 32rpx;
				margin-right: 10rpx;
			}

		}
	}
</style>